<template>
    <view>
        <!-- ================自定义底部tabbar 开始================ -->
        <view class="tabbar">
            <view class="tabbarBox">
                <view class="tabbar-item" v-for="(item, index) in list" :key="index" @click="changeTab(index)">
                    <image class="img" :src="item.selectedIconPath" v-if="currentBar == index" mode="heightFix"></image>
                    <image class="img" :src="item.iconPath" v-else mode="heightFix"></image>
                    <view class="text active" v-if="currentBar == index">{{ item.text }}</view>
                    <view class="text" v-else>{{ item.text }}</view>
                </view>
            </view>

            <view class="safe-area-inset-bottom"></view>

        </view>

        <!-- ================自定义底部tabbar 结束================ -->


    </view>
</template>

<script>
export default {
    name: "pubBottomTabbar",
    props: {
        currentBar: Number,
    },
    created() {},
    data() {
        return {
            showLoginPop: false, //是否显示登录弹窗 true:是 false:否
            list: [
                {
                    selectedIconPath: this.$staticImgurl + "tabbar/ind1-1.png",
                    iconPath: this.$staticImgurl + "tabbar/ind1.png",
                    text: "首页",
                    pagePath: "pages/home/home",
                },
                {
                    selectedIconPath: this.$staticImgurl + "tabbar/ind2-1.png",
                    iconPath: this.$staticImgurl + "tabbar/ind2.png",
                    text: "出口退税",
                    pagePath: "pages/exportTaxRebate/exportTaxRebate",
                },
                {
                    selectedIconPath: this.$staticImgurl + "tabbar/ind3-1.png",
                    iconPath: this.$staticImgurl + "tabbar/ind3.png",
                    text: "直播",
                    pagePath: "pages/live/live",
                },
				{
				    selectedIconPath: this.$staticImgurl + "tabbar/ind4-1.png",
				    iconPath: this.$staticImgurl + "tabbar/ind4.png",
				    text: "在线咨询",
				    pagePath: "pages/onlineConsultation/onlineConsultation",
				},
                {
                    selectedIconPath: this.$staticImgurl + "tabbar/ind5-1.png",
                    iconPath: this.$staticImgurl + "tabbar/ind5.png",
                    text: "我的",
                    pagePath: "pages/mine/mine",
                },
            ],
        };
    },

    onLoad() {
        uni.hideTabBar(); // 隐藏官方的tabBar
    },
    methods: {
        changeTab(e) {
            // if(e == 1 && !uni.getStorageSync("token")){
            // 	this.showLoginPop = true;
            // }else {

            // }
            uni.switchTab({
                url: "/" + this.list[e].pagePath,
            });
        },
        /**
         * @Description: 关闭未登录的弹窗
         * @Author: LiSuwan
         * @Date: 2023-09-23 14:30:52
         */
        closeDialog() {
            this.showLoginPop = false;
        },
    },
};
</script>

<style scoped>
.tabbar {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 99;
    width: 100%;
    /* height:120rpx; */
    background: #fff;
    box-shadow: 5rpx 6rpx 40rpx rgba(24, 47, 98, 0.06);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-radius: 0px;
}

,
.tabbarBox {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 5px 0px;
}

.tabbar-item {
    /* padding: 0 40rpx; */
    width: 20%;
    text-align: center;
}

.img {
    height: 50rpx;
    width: 50rpx;
    display: block;
    margin: 0 auto;
}

.text {
    font-size: 26rpx;
    font-family: PingFang SC-Regular, PingFang SC;
    font-weight: 400;
    color: #999999;
    line-height: 30rpx;
    display: block;
    margin-top: 8rpx;
}

.text.active {
    color: #000000;
}
</style>
